<template>
  <div class="login">
    <el-form ref="form" :model="username" label-width="80px">
      <el-form-item label="用户名">
        <el-input v-model="username"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="password" type="password"></el-input>
      </el-form-item>
      <div style="display: flex">
        <el-form-item label="验证码" style="width: 80%">
          <el-input v-model="yzm"></el-input>
        </el-form-item>
        <div @click="yzmcode += 1">
          <img :src="yzmurl + token + '?cl=' + yzmcode" />
        </div>
      </div>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即登陆</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { ElMessage } from "element-plus";
export default {
  name: "Login",
  data() {
    return {
      username: "",
      password: "",
      yzmurl: this.$baseurl + "showVerifycode/",
      yzmcode: 1,
      yzm: "",
      token: "",
    };
  },
  methods: {
    onSubmit: function () {
      if (this.username == "") {
        ElMessage.error("用户名不能为空");
        return false;
      }
      if (this.password == "") {
        ElMessage.error("密码不能为空");
        return false;
      }
      if (this.yzm == "") {
        ElMessage.error("验证码不能为空");
        return false;
      }
      let that = this;
      this.$jquery.ajax({
        async: false,
        type: "POST",
        dataType: "json",
        url: this.$baseurl + "adminlogin",
        data: {
          username: this.username,
          password: this.password,
          yzm: this.yzm,
          token: this.token,
        },
        success: function (rtn) {
          console.log(rtn);
          if (rtn.code == 1) {
            // that.loginstate = 1;
            ElMessage({
              showClose: true,
              message: "登陆成功",
              type: "success",
            });
            setTimeout(function(){
                that.$parent.loginstate = 1;
                that.$parent.jwttoken=rtn.jwttoken
            },2000)
            
          } else if (rtn.code == -4) {
            that.yzmcode += 1;
            ElMessage.error("验证码不正确");
          }
        },
      });
    },
  },
  created: function () {
    let that = this;
    this.$jquery.ajax({
      async: false,
      type: "GET",
      dataType: "json",
      url: this.$baseurl + "getToken",
      success: function (rtn) {
        if (rtn.code == 1) {
          console.log(rtn.token);
          that.token = rtn.token;
        }
      },
    });
  },
};
</script>
<style scoped>
.login {
  margin-top: 20%;
  width: 30%;
  text-align: center;
  margin-left: 35%;
  margin-right: 35%;
}
</style>